import React,{Suspense} from 'react'
import routes from './Router_config'
import {RouterItem,RouterList} from "../untils/index"
import {BrowserRouter,Route,Routes,Navigate} from "react-router-dom"
type Props = {}

const RouterView = (props: Props) => {
  const renderrouter=(arr:RouterList)=>{
   return arr.map((item:RouterItem,index:number)=>{
   return <Route path={item.path} key={index} element={
    item.element?<item.element/>:<Navigate to={item.to as string}/>
   }>
    {
      item.children&&renderrouter(item.children)
    }
   </Route>
   })
  }
  return (
    <Suspense fallback={<div>路由加载中...</div>}>
    <BrowserRouter>
    <Routes>
      {
      renderrouter(routes)
      }
    </Routes>
    </BrowserRouter>
    </Suspense>
  )
}

export default RouterView